import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(primaryColor: Colors.green),
      home: Home(),
    );
  }
}

class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    //设置尺寸（填写设计中设备的屏幕尺寸）如果设计基于360dp * 690dp的屏幕
    ScreenUtil.init(
        BoxConstraints(
            maxWidth: MediaQuery.of(context).size.width,
            maxHeight: MediaQuery.of(context).size.height),
        designSize: Size(360, 720),
        orientation: Orientation.portrait);
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
      ),
      body: Center(
        child: Column(
          children: [
            ElevatedButton(
              onPressed: () {},
              child: Text("ElevatedButton"),
              clipBehavior: Clip.antiAlias,
              style: ButtonStyle(
                  backgroundColor: MaterialStateProperty.all(Colors.green),
                  shape: MaterialStateProperty.all(RoundedRectangleBorder(
                      borderRadius: BorderRadius.all(Radius.circular(15))))),
            ),
            ElevatedButton(
              onPressed: () {},
              child: Text(
                "ElevatedButton",
                textAlign: TextAlign.center,
              ),
              clipBehavior: Clip.antiAlias,
              style: ButtonStyle(
                  fixedSize: MaterialStateProperty.all(Size(100, 100)),
                  backgroundColor: MaterialStateProperty.all(Colors.green),
                  shape: MaterialStateProperty.all(CircleBorder())),
            ),
            ElevatedButton(
              onPressed: () {},
              child: Text(
                "ElevatedButton",
                textAlign: TextAlign.center,
              ),
              clipBehavior: Clip.antiAlias,
              style: ElevatedButton.styleFrom()
            ),
            ElevatedButton(
                onPressed: () {},
                child:InkWell(
                  child: Text("1"),
                  splashColor: Colors.green,
                ),

            ),
            TextButton(
              onPressed: () => {},
              child: Text("TextButton"),
              clipBehavior: Clip.antiAlias,
              style: ButtonStyle(),
            ),
            OutlinedButton(
              onPressed: () => {},
              child: Text("OutlinedButton",style: TextStyle(color: Colors.white),),
              style: ButtonStyle(
                  backgroundColor: MaterialStateProperty.all(Colors.green),
                  splashFactory: InkSplash.splashFactory,
                  shape: MaterialStateProperty.all(RoundedRectangleBorder(
                      borderRadius: BorderRadius.all(Radius.circular(15))))),
            )
          ],
        ),
      ),
    );
  }
}
